﻿<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8"/>
    <!--    <meta http-equiv="refresh" content="60;url='https://gitee.com/iGaoWei/big-data-view'" />-->
    <title>数据分析通用模版</title>
    <script th:src="@{js/jquery.js}" type="text/javascript"></script>
    <link rel="stylesheet" th:href="@{css/comon0.css}"/>
    <style>
        table {
            border-collapse: collapse;
            width: 100%;
            table-layout: fixed; /* 使用固定布局 */
        }

        th, td {
            overflow: hidden;
            text-overflow: ellipsis;
            max-width: 100px;
            /* 隐藏溢出内容 */
            /* 在溢出时显示省略号 */
            white-space: nowrap; /* 不换行 */
        }

    </style>
</head>
<body>
<div class="loading">
    <div class="loadbox">
        <img th:src="@{images/loading.gif}"/> 页面加载中...
    </div>
</div>
<div class="head">
    <h1><a href="https://gitee.com/iGaoWei/big-data-view">数据分析通用模版</a></h1>
    <div class="time" id="showTime">
        2019/12/05 16:16:54
    </div>
    <script>
        var t = null;
        t = setTimeout(time, 1000);//開始运行
        function time() {
            clearTimeout(t);//清除定时器
            dt = new Date();
            var y = dt.getFullYear();
            var mt = dt.getMonth() + 1;
            var day = dt.getDate();
            var h = dt.getHours();//获取时
            var m = dt.getMinutes();//获取分
            var s = dt.getSeconds();//获取秒
            var t = null;
            document.getElementById("showTime").innerHTML = y + "/" + Appendzero(mt) + "/" + Appendzero(day) + " " + Appendzero(h) + ":" + Appendzero(m) + ":" + Appendzero(s) + "";

            function Appendzero(obj) {
                if (obj < 10) return "0" + "" + obj;
                else return obj;
            }

            t = setTimeout(time, 1000); //设定定时器，循环运行
        }

    </script>

</div>
<div class="mainbox">
    <ul class="clearfix">
        <li>
            <div class="boxall" style="height: calc(58% - .15rem)">
                <div class="alltitle">
                    工作地点TOP10
                </div>
                <div class=" boxnav " id="echarts4">
                </div>
            </div>
            <div class="boxall" style="height: calc(42% - .15rem)">
                <div class="alltitle">
                    标题名称
                </div>
                <div class="boxnav" id="echarts3"></div>
            </div>
        </li>
        <li>
<!--            <div class="boxall" style="height: calc(20% - .15rem)">-->
<!--                <ul class="row h100 clearfix">-->
<!--                    <li class="col-6">-->
<!--                        <div class="sqzs h100">-->
<!--                            <p>业绩总览</p>-->
<!--                            <h1><span>30500</span>万</h1>-->
<!--                        </div>-->
<!--                    </li>-->
<!--                    <li class="col-6">-->
<!--                        <ul class="row h100 clearfix">-->
<!--                            <li class="col-4">-->
<!--                                <div class="tit01">-->
<!--                                    标题名称-->
<!--                                </div>-->
<!--                                <div class="piebox" id="pe01"></div>-->
<!--                            </li>-->
<!--                            <li class="col-4">-->
<!--                                <div class="tit01">-->
<!--                                    标题名称-->
<!--                                </div>-->
<!--                                <div class="piebox" id="pe02"></div>-->
<!--                            </li>-->
<!--                            <li class="col-4">-->
<!--                                <div class="tit01">-->
<!--                                    标题名称-->
<!--                                </div>-->
<!--                                <div class="piebox" id="pe03"></div>-->
<!--                            </li>-->
<!--                        </ul>-->
<!--                    </li>-->
<!--                </ul>-->
<!--            </div>-->
            <div class="boxall" style="height: calc(38% - .15rem)">
                <div class="alltitle">
                    经验要求
                </div>
                <div class="boxnav" id="echarts1"></div>
            </div>
            <div class="boxall" style="height: calc(42% - .15rem)">
                <div class="alltitle">
                    公司性质占比图
                </div>
                <div class="boxnav" id="echarts2"></div>
            </div>
        </li>
        <li>
            <div class="boxall" style="height: calc(33.333% - .15rem)">
                <div class="alltitle">
                    招聘人数
                </div>
                <div class="boxnav" id="echarts5"></div>
            </div>
            <div class="boxall" style="height: calc(33.333% - .15rem)">
                <div class="alltitle">
                    公示栏
                </div>
                <div class="boxnav" id="tableData">
                    <table border="0" cellspacing="0">
                        <thead>
                        <tr>
                            <td>公司名称</td>
                            <td>性质</td>
                            <td>规模</td>
                            <td>在招岗位</td>
                            <td>薪资</td>
                            <td>办公地点</td>
                            <td>hr</td>
                            <td>状态</td>
                        </tr>
                        </thead>
                        <tbody>
                        <tr>
                            <th>加载中...</th>
                            <td>加载中...</td>
                            <td>加载中...</td>
                            <td>加载中...</td>
                            <td>加载中...</td>
                            <td>加载中...</td>
                            <td>加载中...</td>
                            <td>加载中...</td>
                        </tr>
                        <tr>
                            <th>加载中...</th>
                            <td>加载中...</td>
                            <td>加载中...</td>
                            <td>加载中...</td>
                            <td>加载中...</td>
                            <td>加载中...</td>
                            <td>加载中...</td>
                            <td>加载中...</td>
                        </tr>
                        <tr>
                            <th>加载中...</th>
                            <td>加载中...</td>
                            <td>加载中...</td>
                            <td>加载中...</td>
                            <td>加载中...</td>
                            <td>加载中...</td>
                            <td>加载中...</td>
                            <td>加载中...</td>
                        </tr>
                        <tr>
                            <th>加载中...</th>
                            <td>加载中...</td>
                            <td> 加载中...</td>
                            <td>加载中...</td>
                            <td>加载中...</td>
                            <td>加载中...</td>
                            <td>加载中...</td>
                            <td>加载中...</td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
            <div class="boxall" style="height: calc(33.333% - .15rem)">
                <div class="alltitle">
                    学历占比饼图
                </div>
                <div class="boxnav" id="echarts6" style="height:calc(100% - .3rem);"></div>
            </div>
        </li>
    </ul>
</div>
<script th:src="@{js/echarts.min.js}" type="text/javascript"></script>
<script language="JavaScript" th:src="@{js/js.js}"></script>
</body>
</html>